import Link from "next/link";
import styles from "./index.module.scss";
import Image from "../Image";

function Index({ fromList }) {
  const list = [
    {
      id: 5,
      title: "求职简历特长与爱好怎么写更吸引人？",
      description:
        "百捷简历攻略提供HR专家原创内容，包括简历技巧、求职指南、面试攻略、职场攻略以及大量案例，配合专业的中英双语简历模板，致力于帮助求职者顺畅找到高薪名企好工作，精选名企大牛简历案例模板，高效制作专业求职简历，同时各行业简历模板免费下载，百捷简历模板能够帮助求职者大大提升获得面试的几率。",
      img: "https://resume.cjasen.com/RHenIHK1589014545Jtr9k726723045.png",
    },
    {
      id: 6,
      title: "如何准备大学生求职简历？",
      description:
        "如果现在有一份非常不错的工作摆在你面前，你觉得你的求职简历能让你获取到这个面试机",
      img: "https://resume.cjasen.com/Sh0Kkme1588068367galNvUQ6678147.png",
    },
    {
      id: 7,
      title: "工作简历基本要求_写作原则是什么？",
      description:
        "工作简历的作用是将自己推销出去，求职简历也可以说是用人单位对你的第一印象，还在质",
      img: "https://resume.cjasen.com/vDAHcQE1588068316Ifwl2Mv6678142.png",
    },
    {
      id: 8,
      title: "无工作经验的应届毕业生如何制作简历？",
      description:
        "01. 应届毕业生也能写好简历自从我的课程上线后，每周都会有10几个同学在微信问",
      img: "https://resume.cjasen.com/lohzCMn1588067902e2hZLYX6678118.png",
    },
    {
      id: 9,
      title: "简历中的减分项有哪些",
      description:
        "百捷简历攻略提供HR专家原创内容，包括简历技巧、求职指南、面试攻略、职场攻略以及大量案例，配合专业的中英双语简历模板，致力于帮助求职者顺畅找到高薪名企好工作，精选名企大牛简历案例模板，高效制作专业求职简历，同时各行业简历模板免费下载，百捷简历模板能够帮助求职者大大提升获得面试的几率。",
      img: "https://resume.cjasen.com/5JcncVj1588067615oKFAhDk6678089.png",
    },
  ];
  return (
    <div>
      <div className={styles.rightContent}>
        <div className={styles.head}>
          <h3 className={styles.title}>精选模板</h3>
          <Link className={styles.more} href={"/muban/list"}>
            {" "}
            更多模板 {">>"}
          </Link>
        </div>
        <Link href={"/content?mid=12"} className={styles.templateItem}>
          <div className={styles.img}>
            <div className={styles.cover}>
              <div className={styles.button}>使用模板</div>
            </div>
            <Image
              src="https://resume.cjasen.com/bj_1716544536124.webp"
              alt="极简简历模板"
              width={"100%"}
            />
          </div>
          <div className={styles.info}>
            <h4 className={styles.name}>极简简历模板</h4>
            <div className={styles.tags}>
              <span className={styles.tag}>校招</span>
              <span className={styles.tag}>实习</span>
              <span className={styles.tag}>社招</span>
              <span className={styles.tag}>免费</span>
            </div>
          </div>
        </Link>
        <Link href={"/content?mid=10"} className={styles.templateItem}>
          <div className={styles.img}>
            <div className={styles.cover}>
              <div className={styles.button}>使用模板</div>
            </div>
            <Image
              src="https://resume.cjasen.com/bj_1716544722310.webp"
              alt="专业简历模板"
              width={"100%"}
            />
          </div>
          <div className={styles.info}>
            <h4 className={styles.name}>专业简历模板</h4>
            <div className={styles.tags}>
              <span className={styles.tag}>校招</span>
              <span className={styles.tag}>实习</span>
              <span className={styles.tag}>社招</span>
            </div>
          </div>
        </Link>
        <Link href={"/content?mid=6"} className={styles.templateItem}>
          <div className={styles.img}>
            <div className={styles.cover}>
              <div className={styles.button}>使用模板</div>
            </div>
            <Image
              src="https://resume.cjasen.com/bj_1716544659383.webp"
              alt="专业简历模板"
              width={"100%"}
            />
          </div>
          <div className={styles.info}>
            <h4 className={styles.name}>专业简历模板</h4>
            <div className={styles.tags}>
              <span className={styles.tag}>校招</span>
              <span className={styles.tag}>实习</span>
              <span className={styles.tag}>社招</span>
              <span className={styles.tag}>左右分栏</span>
            </div>
          </div>
        </Link>
      </div>
      {!fromList ? (
        <div className={styles.rightContent}>
          <div className={styles.head}>
            <h3 className={styles.title}>内容推荐</h3>
            <Link className={styles.more} href={"/recommend/1"}>
              {" "}
              更多内容 {">>"}
            </Link>
          </div>
          {list.map((item) => {
            return (
              <Link
                href={`/recommendDetail/${item.id}`}
                className={styles.contentItem}
                key={item.id}
              >
                <div className={styles.info}>
                  <h4 className={styles.title}>{item.title}</h4>
                  <h5 className={styles.desc}>{item.description}</h5>
                </div>
              </Link>
            );
          })}
        </div>
      ) : null}
    </div>
  );
}
export default Index;
